<template>
	<view class="addInvoiceInfo">
		<view class="top_tab"><shortTabs :tabs="tabs" :curTabs="curTabs" @changeTab="changeTab"></shortTabs></view>
		<view class="content">
			<view class="person_form" v-show="curTabs == 0">
				<view class="area-title">姓名</view>
				<view class="row_input_box"><input type="text" v-model="personObj.name" placeholder="请输入姓名" /></view>
				<view class="area-title">收票邮箱</view>
				<view class="row_input_box"><input type="text" v-model="personObj.e_mail" placeholder="请输入收票邮箱" /></view>
			</view>
			<view class="company_form" v-show="curTabs == 1">
				<view class="area-title">企业名称</view>
				<view class="row_input_box"><input type="text" v-model="companyObj.name" placeholder="请输入企业名称" /></view>
				<view class="area-title">纳税人识别号</view>
				<view class="row_input_box"><input type="text" v-model="companyObj.tax_num" placeholder="请输入纳税人识别号" /></view>
				<view class="area-title">收票邮箱</view>
				<view class="row_input_box"><input type="text" v-model="companyObj.e_mail" placeholder="请输入收票邮箱" /></view>
			</view>
			<view class="fix_btn_box"><button class="yellow_btn" @tap="addInvoiceHead">确定</button></view>
		</view>
	</view>
</template>

<script>
import shortTabs from '../../components/shortTabs/shortTabs.vue';
export default {
	components: {
		shortTabs
	},
	data() {
		return {
			curTabs: 0,
			tabs: ['个人/非企业', '企业'],
			personObj: {
				name: '',
				e_mail: ''
			},
			companyObj: {
				name: '',
				e_mail: '',
				tax_num: ''
			},
			editInfo: {}
		};
	},
	onLoad(val) {
		if (val.info) {
			let info = JSON.parse(val.info);
			console.log(info, '编辑新奇');
			this.editInfo = info;
			if (info.type == 1) {
				this.personObj.name = info.name;
				this.personObj.e_mail = info.e_mail;
				this.curTabs = 0;
			} else {
				this.companyObj.name = info.name;
				this.companyObj.e_mail = info.e_mail;
				this.companyObj.tax_num = info.tax_num;
				this.curTabs = 1;
			}
		}
	},
	methods: {
		changeTab(idx) {
			this.curTabs = idx;
		},
		addInvoiceHead() {
			let params = {
				type: ''
			};
			let api = 'addInvoiceHead';
			if (this.curTabs == 0) {
				params.type = 1;
				params = { ...params, ...this.personObj };
			} else {
				params.type = 2;
				params = { ...params, ...this.companyObj };
			}
			if (this.editInfo.id) {
				params.id = this.editInfo.id;
				api = 'editInvoiceHead';
			}
			this.$api[api](params).then(res => {
				this.$helper.toast(res.msg);
				if (res.code == 1) {
					setTimeout(() => {
						uni.navigateBack();
					}, 500);
				}
			});
		}
	}
};
</script>

<style lang="scss">
.addInvoiceInfo {
	.top_tab {
		box-sizing: border-box;
		padding: 40rpx 30rpx;
		background-color: #f9f9f9;
	}
	.content {
		padding: 28rpx 24rpx;
		background-color: #fff;
		min-height: calc(100vh - 150rpx);
	}
	.row_input_box {
		display: flex;
		align-items: center;
		padding: 24rpx;
		height: 90rpx;
		box-sizing: border-box;
		background: #f9f9f9;
		border-radius: 10rpx;
		font-size: 28rpx;
		color: #999;
		margin-bottom: 20rpx;
	}
	.fix_btn_box {
		position: fixed;
		bottom: 20rpx;
		width: 94%;
		margin: 0 auto;
	}
}
</style>
